<script>
import { getResultApi } from '@/api'
export default {
    data() {
        return {
            key: this.$route.query.key,
            list: [],
            loading: false,
            finished: false,
            // 当前页
            page: 1,
            // 页容量
            per_page: 10,
            // 总记录
            total: -1
        }
    },
    methods: {
        async onLoad() {
            const res = await getResultApi({
                page: this.page,
                per_page: this.per_page,
                q: this.key
            })
            this.list.push(...res.data.data.results)
            this.total = res.data.data.total_count
            this.page++
            this.loading = false
            if (this.list.length >= this.total) {
                this.finished = true
            }
        }
    }
}
</script>

<template>
  <div class="result">
    <!-- 顶部导航栏 -->
    <van-nav-bar :title="key + '搜索结果'" fixed />
    <!-- 搜索结果 -->
    <van-list @load="onLoad" v-model="loading" :finished="finished" finished-text="没有更多了">
        <van-cell @click="$router.push(`/home/detail?id=${item.art_id}`)" v-for="(item,index) in list" :key="index" :title="item.title" />
    </van-list>
  </div>
</template>

<style lang="less">
.result {
  margin-top: 50px;
}
</style>